<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
        <meta name="apple-mobile-web-app-capable" content="yes">
        <meta name="apple-mobile-web-app-status-bar-style" content="black">
        <meta name="format-detection" content="telephone=no">
        
        <title>查看可用商品</title>
        
        <link rel="stylesheet" href="css/view.css?t=201611301751" />
    </head>
    <body id="coupon" v-cloak>
		<!--搜索栏-->
		<div class="coupon-search">
			<div class="ipt-box">
				<span class="sprites i-search"></span>
				<input id="ipt" class="ipt" type="text" v-model="iptVal" placeholder="输入商品名称查看可用商品" @keyup.enter="newSearch(iptVal)" />
				<a href="javascript:;" class="sprites i-close" v-show="iptVal!=''" @click="iptVal=''"></a>
			</div>
		</div>
		<!--优惠券列表-->
		<div class="search-tips">以下商品可用易券，面额{{couponValue}}元，{{couponRule}}</div>
		<template v-if="goods.length!=0">
		<div class="select-list">
			<div class="select-box">
				<div class="lt">
					<select class="select" v-model="selected" @change="chooseMenu">
						<option value="0">综合排序</option>
						<option value="6">评论数降序</option>
						<option value="8">销售数量降序</option>
						<option value="9">价格升序</option>
						<option value="10">价格降序</option>
					</select>
				</div>
				<div class="rt">
					<a href="javascript:;" @click="chooseSelf"><span class="sprites i-checkbox" :class="{'sel':self==1}"></span><span>苏宁服务</span></a>
					<a href="javascript:;" @click="chooseStock"><span class="sprites i-checkbox" :class="{'sel':stock==1}"></span><span>有货</span></a>
				</div>
			</div>
			<div v-infinite-scroll="loadMore()" infinite-scroll-disabled="busy" infinite-scroll-distance="10">
				<div class="item" v-for="item in goods">
					<a href="javascript:;" class="info" @click="goodLink(item)">
						<div class="lt">
							<img :src="item.partnumber | imgURL" alt="" />
						</div>
						<div class="rt">
							<div class="name"><span class="tag" v-if="item.priceType==1">自营</span><span>{{item.catentDesc}}</span></div>
							<div class="price"><span>&yen;{{item.searchPrice}}</span><span class="tag" v-if="item.priceType!=1&&item.priceType!=''">{{item.priceType | priceType}}</span></div>
							<div class="comment">
								<p>评论<span>{{item.countOfarticle}}</span>条</p>
								<p>好评<span>{{item.praiseRate | praiseRate}}</span></p>
							</div>
						</div>
					</a>
				</div>
			</div>
		</div>
		</template>
		<!--暂无可发的优惠券-->
		<div class="no-data" v-else>
			<div class="icon-nodata"></div>
			<div class="text">搜索不到可用商品</div>
		</div>
		
		<script src="js/zepto.min.js" type="text/javascript"></script>
		<script src="js/vue.min.js" type="text/javascript"></script>
		<script src="js/vue-resource.js" type="text/javascript"></script>
		<script src="js/vue-infinite-scroll.js" type="text/javascript"></script>
		<script src="js/common.js?t=201611301751" type="text/javascript"></script>
		<script type="text/javascript">
			var vm = new Vue({
                el: '#coupon',
                data: {
	                goods: [],
	                selected: 0,
	                self: 0,
	                stock: 0,
	                totalPage:"",
	                pageNum: 0,
	                cityCode: "",
	                mdmCityCode: "",
	                busy: false,
	                
	                itemsLen:null,
	                sendTimes:"",
	                remainTimes:"",
	                timeRetFlag:"",
	                iptVal: "",
	                retFlag:null,
	                
	                cityId: "",
	                couponRuleId: "",
	                couponRule:"",
	                couponValue:"",
	                
                    err: false,
                    errCtt: ""
                },
                computed: {
                    
                },
                methods: {
                	searchCoupon: function(keyword,page){
                    	this.$http.jsonp(DI.searchCoupon + "wap/" + this.cityCode + "-" + this.couponRuleId + "-0-" + this.iptVal + "--10-" + this.pageNum + "-" + this.selected + "-" + this.self + "-" + this.stock + "--.jsonp", {
							jsonpCallback: 'quanSearchCallback'
						}).then(function(res) {
							var result = res.data;
							var resData = [];
							var paramPartnumber = [];
							var commList = [];
							resData = result.goods;
							this.totalPage = Math.ceil(result.goodsCount/10);
							if(resData && resData.length > 0){
								for (var i = 0; i < resData.length; i++) {
									resData[i].couponValue = "";
									resData[i].couponRule = "";
									resData[i].couponNum = "";
									
									resData[i].searchPrice = "";
									resData[i].priceType = "";
									resData[i].praiseRate = resData[i].praiseRate ? resData[i].praiseRate : 100;
							    	this.goods.push(resData[i]);
							    	paramPartnumber.push('000000000' + resData[i].partnumber);
							    	commList.push({
							    		actType: resData[i].priceType,
							    		commCode:'000000000' + resData[i].partnumber,
							    		storeId: resData[i].salesName
							    	})
							    }
								
								this.searchPrice(resData, paramPartnumber.join(','));
							}
						}, function(req) {
			
						});
                   	},
                   	searchPrice: function(goodsList, params){
                    	this.$http.jsonp(DI.getAllPriceNew + "getAllPriceNew.htm?cmmdtyCode=" + params + "&cityCode=" + this.mdmCityCode + "&chan=5&type=1&isCache=1&callback=FourPage", {
							jsonpCallback: 'FourPage'
						}).then(function(res) {
							var result = res.data;
							for(var i = 0; i < goodsList.length; i++){
			                    goodsList[i].searchPrice = result[i].price;
			                    goodsList[i].priceType = result[i].priceType;
	                		}
						}, function(req) {
			
						});
                    },
                    chooseMenu: function(){
                    	this.goods = [];
                    	this.pageNum = 0;
                    	this.searchCoupon(this.iptVal);
                    },
                    chooseSelf: function(){
                    	this.goods = [];
                    	this.pageNum = 0;
                    	
                    	if(this.self!=1){
                    		this.self = 1;
                    	}else{
                    		this.self = 0;
                    	}
                    	this.searchCoupon(this.iptVal);
                    },
                    chooseStock: function(){
                    	this.goods = [];
                    	this.pageNum = 0;
                    	
                    	if(this.stock!=1){
                    		this.stock = 1;
                    	}else{
                    		this.stock = 0;
                    	}
                    	this.searchCoupon(this.iptVal);
                    },
                    newSearch: function(keyword){
                    	this.goods = [];
                    	this.pageNum = 0;
                    	this.searchCoupon(keyword);
                    	$("#ipt").blur();
                    },
                    goodLink: function(item){
					    if(item.partnumber && item.partnumber != ''){
					    	if(item.priceType && item.priceType == 1){
					    		location.href = '//m.suning.com/product/0000000000/' + item.partnumber + '.html';
					    	}else{
					    		if(item.salesName!=null && item.salesName!=''){
					    			location.href = '//m.suning.com/product/'+ item.salesName +'/' + item.partnumber + '.html';
					    		}else{
					    			location.href = '//m.suning.com/product/0000000000/' + item.partnumber + '.html';
					    		}
					    	}
					    }
                    },
                    loadMore: function() {
                   		if(this.totalPage>1 && this.pageNum!=this.totalPage){
                   			this.busy = true;
							
							this.pageNum++;
							this.searchCoupon(this.iptVal,this.pageNum);
						    this.busy = false;
                   		}
    				}
                },
                ready: function(){
                	var urlArgs = Shop.getUrlArgs();
                	
                	this.cityCode = urlArgs.cityCode;
                	this.mdmCityCode = urlArgs.mdmCityCode;
                	this.couponValue = urlArgs.couponValue;
                	this.couponRule = urlArgs.couponRule;
                	this.couponRuleId = urlArgs.couponRuleId;
//              	this.couponRuleId = "1201610310000516432";
                	
                	this.searchCoupon(this.iptVal);
                }
            });
		</script>
    </body>
</html>